<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="de" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Campus3D</title>
<link rel="stylesheet" type="text/css"
              href="http://www.x3dom.org/download/x3dom.css" />
        <script type="text/javascript"
                src="http://www.x3dom.org/download/x3dom.js">
        </script>
<script src="http://code.google.com/apis/gears/gears_init.js" type="text/javascript" charset="utf-8"></script>
        <script src="geo.js?id=1" type="text/javascript" charset="utf-8"></script>
        
        </script>

<script type="text/javascript">
//Mensa
window.document.onkeydown = function (e)
{
    if (!e){
        e = event;
    }
    if (e.keyCode == 27){
        lightbox_close_Mensa();
    }
}

function lightbox_open_Mensa(){
    window.scrollTo(0,0);
    document.getElementById('light_Mensa').style.display='block';
    document.getElementById('fade_Mensa').style.display='block';  
    document.getElementById('mensapoint').setAttribute('diffuseColor','red');
}

function lightbox_close_Mensa(){
    document.getElementById('light_Mensa').style.display='none';
    document.getElementById('fade_Mensa').style.display='none';
}

//Bibliothek
window.document.onkeydown = function (e)
{
    if (!e){
        e = event;
    }
    if (e.keyCode == 27){
        lightbox_close_Bibliothek();
    }
};

function lightbox_open_Bibliothek(){
    window.scrollTo(0,0);
    document.getElementById('light_Bibliothek').style.display='block';
    document.getElementById('fade_Bibliothek').style.display='block';
    document.getElementById('bibliothekpoint').setAttribute('diffuseColor','red');
}

function lightbox_close_Bibliothek(){
    document.getElementById('light_Bibliothek').style.display='none';
    document.getElementById('fade_Bibliothek').style.display='none';
}
//SSC
window.document.onkeydown = function (e)
{
    if (!e){
        e = event;
    }
    if (e.keyCode == 27){
        lightbox_close_SSC();
    }
}

function lightbox_open_SSC(){
    window.scrollTo(0,0);
    document.getElementById('light_SSC').style.display='block';
    document.getElementById('fade_SSC').style.display='block';  
    document.getElementById('sscpoint').setAttribute('diffuseColor','red');
}

function lightbox_close_SSC(){
    document.getElementById('light_SSC').style.display='none';
    document.getElementById('fade_SSC').style.display='none';
}
//Baum
window.document.onkeydown = function (e)
{
    if (!e){
        e = event;
    }
    if (e.keyCode == 27){
        lightbox_close_Baum();
    }
}

function lightbox_open_Baum(){
    window.scrollTo(0,0);
    document.getElementById('light_Baum').style.display='block';
    document.getElementById('fade_Baum').style.display='block';  
    document.getElementById('baumpoint').setAttribute('diffuseColor','red');
    
}

function lightbox_close_Baum(){
    document.getElementById('light_Baum').style.display='none';
    document.getElementById('fade_Baum').style.display='none';
}
</script>
        
<style>
.signatur{color:blue}
h1 {color:green}

#fade_Mensa{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index:1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}
#light_Mensa{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;                 
    padding: 10px;
    border: 2px solid #FFF;
    background: #CCC;
    z-index:1002;
    overflow:visible;
}

#fade_Bibliothek{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index:1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}
#light_Bibliothek{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;                 
    padding: 10px;
    border: 2px solid #FFF;
    background: #CCC;
    z-index:1002;
    overflow:visible;
}

#fade_SSC{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index:1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}
#light_SSC{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;                 
    padding: 10px;
    border: 2px solid #FFF;
    background: #CCC;
    z-index:1002;
    overflow:visible;
}

#fade_Baum{
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index:1001;
    -moz-opacity: 0.7;
    opacity:.70;
    filter: alpha(opacity=70);
}
#light_Baum{
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;                 
    padding: 10px;
    border: 2px solid #FFF;
    background: #CCC;
    z-index:1002;
    overflow:visible;
}
</style>

</head>

<div align="center">

<p>
<h1>Campus3D</h1><br>
<input type="submit" value=" neuer Standort " onclick="gps()"></input>
</p>


<body>
    <div id="light_Mensa"><img src="Mensa.jpg" width="300" height="200" alt="Mensa">Mensa</div>
<div id="fade_Mensa" onClick="lightbox_close_Mensa();"></div>

<div id="light_Bibliothek"><img src="Bibliothek.jpg" width="300" height="200" alt="Bibliothek">Bibliothek</div>
<div id="fade_Bibliothek" onClick="lightbox_close_Bibliothek();"></div>

<div id="light_SSC"><img src="SSC.jpg" width="300" height="200" alt="SSC">SSC</div>
<div id="fade_SSC" onClick="lightbox_close_SSC();"></div>

<div id="light_Baum"><img src="Bäume.jpg" width="300" height="200" alt="Bäume">Bäume</div>
<div id="fade_Baum" onClick="lightbox_close_Baum();"></div>

<x3d width="1200px" height="800px">
        <scene>
            <viewpoint id="standort" position="0 2 0"></viewpoint>




            <transform id="campus">

                <transform>
                    <transform scale="10 0.5 10">
                        <shape>
                            <appearance>
                                <ImageTexture  url="textur.jpg"></ImageTexture>
                            </appearance>
                            <box></box>
                        </shape>
                    </transform>
                </transform>



               <!--Mensa -->
                <transform translation="3 1 -3">
                    <transform rotation="0 10 0 -139.80">
                        <transform scale="4.2 0.5 1.2">

                                <shape>
                                <appearance>
                                  <material></material>
                                  </appearance>
                                  <box></box>
                                </shape>

                                 </transform>
                    </transform>
                </transform>
               <!--POI MENSA-->
               <transform>
               <transform translation="1.5 1 -3">
                    <transform rotation="0 10 0 -139.80">
                        <transform scale="0.05 0.05 0.05">

                                <shape onclick="lightbox_open_Mensa()">
                                <appearance>
                                  <material id="mensapoint" diffuseColor='green'></material>
                                  </appearance>
                                  <sphere></sphere>
                                </shape>

                                 </transform>
                    </transform>
                </transform>
                   </transform

                

                    <!--Bibliothek-->
                    <transform translation="0 1 5">
                        <transform>
                        <transform scale="4 0.5 2.5">

                                    <shape>
                                        <appearance>
                                            <material></material>
                                        </appearance>
                                        <box></box>
                                    </shape>

                        </transform>
                            </transform>
                     </transform>
               <!--POI Bibliothek-->
               <transform >
                <transform translation="0 1 2">

                        <transform scale="0.05 0.05 0.05">

                                    <shape onclick="lightbox_open_Bibliothek()">
                                        <appearance>
                                            <material id="bibliothekpoint" diffuseColor='green'></material>
                                        </appearance>
                                        <sphere></sphere>
                                    </shape>

                        </transform>
                            </transform>
                     </transform>
            </transform>


                <transform>

                    <!--SSC
                    -->
                    <transform translation="-2 1 -8">
                                                 <transform rotation=" 0 0 -270">
                                 <transform scale="3 0.5 0.5">

                                    <shape>
                                        <appearance>
                                            <material></material>
                                        </appearance>
                                        <box></box>
                                    </shape>

                        </transform>
                            </transform>
                        </transform>
                    <!--POI SSC-->
                    <transform >
                    <transform translation="-2 1 -7">
                                                 <transform rotation=" 0 0 -270">
                                 <transform scale="0.05 0.05 0.05">
                                 
                                    <shape onclick="lightbox_open_SSC()">
                                        <appearance>
                                            <material id="sscpoint" diffuseColor='green'></material>
                                        </appearance>
                                        <sphere></sphere>
                                    </shape>

                        </transform>
                            </transform>
                        </transform>
                    </transform>
                    
                    <!--POI Baeume-->
                    <transform >
                     <transform translation="-2 0.54 -3">
                                                 <transform rotation=" 0 0 -270">
                                 <transform scale="0.05 0.05 0.05">
                                 
                                    <shape onclick="lightbox_open_Baum()">
                                        <appearance>
                                            <material id="baumpoint" diffuseColor='green'></material>
                                        </appearance>
                                        <sphere></sphere>
                                    </shape>

                        </transform>
                            </transform>
                        </transform>
                    </transform>
        </scene>
    </x3d>



<p class="signatur">
Kuchenkäse

</p>

</div>

</body>
</html>